<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>个人业绩报表</title>
    <link rel="icon" href="favicon.ico" type="images/ico">
    <meta name="author" content="dc">
    <link rel="stylesheet" type="text/css" href="/css/materialdesignicons.min.css">
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="/css/style.min.css">
    <link href="/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/js/jquery-confirm/jquery-confirm.min.css"/>
    <!--固定table列-->
    <link href="/js/bootstrap-table/extensions/fixed-columns/bootstrap-table-fixed-columns.min.css" rel="stylesheet"/>
    <!--时间选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css"/>
    <!--日期选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datepicker/bootstrap-datepicker3.min.css"/>
    <!-- 多选下拉 -->
    <link rel="stylesheet" href="/css/bootstrap-select.css" type="text/css"/>
    <link rel="stylesheet" href="/css/swiper/swiper.min.css"/>
    <link rel="stylesheet" href="/css/skin.css"/>
    <link rel="stylesheet" href="/css/personalresults/personalResultsReport.css"/>
</head>
<body>
<div class="ranking-main">
    <div class="ranking-title clearfix">
        <h1>个人业绩统计</h1>
        <div class="ranking-screen clearfix">
            <label>
                <i class="mdi mdi-calendar-range"></i>
                <input type="text" class="form-control" id="dateYear">
            </label>
            <!--<label class="pull-left">
                <i class="mdi mdi-calendar-range"></i>
                <input type="text" class="form-control" id="dateMonth">
            </label>-->
        </div>
    </div>
    <div class="ranking-content">
        <div class="ranking-list">
            <input type="text" id="accountId" hidden>
            <h2>业绩排名</h2>
            <table id="rankTable"></table>
        </div>
        <div class="ranking-info">
            <ul class="nav nav-tabs tabs-lg" role="tablist">
                <li class="active"><a href="#performanceAnalysis" aria-controls="performanceAnalysis" role="tab" data-toggle="tab">业绩分析</a></li>
                <li class=""><a href="#callAnalysis" aria-controls="callAnalysis" role="tab" data-toggle="tab">呼叫分析</a></li>
                <li class=""><a href="#followAnalysis" aria-controls="followAnalysis" role="tab" data-toggle="tab">跟进分析</a></li>
                <li class=""><a href="#taskProgress" aria-controls="taskProgress" role="tab" data-toggle="tab">任务进度</a></li>
            </ul>
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane performance-analysis active" id="performanceAnalysis">
                    <div class="performance-row">
                        <div class="well form-well">
                            <h3>业绩组成</h3>
                            <div id="proportionChart" style="height: 260px;"></div>
                        </div>
                        <div class="well form-well">
                            <h3>业绩组成</h3>
                            <div class="proportion-well">
                                <h5>会员产品业绩</h5>
                                <p id="memberProductAmount"></p>
                            </div>
                            <div class="proportion-well m-b-0">
                                <h5>非会员产品业绩</h5>
                                <p id="nomemberProductAmount"></p>
                            </div>
                        </div>
                    </div>
                    <div class="well form-well">
                        <h3>产品详情</h3>
                        <table id="productTable"></table>
                    </div>
                    <div class="well form-well m-b-0">
                        <h3>回款能力</h3>
                        <div class="row">
                            <div class="col-xs-4">
                                <div class="ability-well">
                                    <img src="/images/rank-icon-1.png" alt="">
                                    <h5>创建合同数</h5>
                                    <p id="contractNum"></p>
                                </div>
                            </div>
                            <div class="col-xs-4">
                                <div class="ability-well">
                                    <img src="/images/rank-icon-2.png" alt="">
                                    <h5>回款合同数</h5>
                                    <p id="returnContractNum"></p>
                                </div>
                            </div>
                            <div class="col-xs-4">
                                <div class="ability-well">
                                    <img src="/images/rank-icon-3.png" alt="">
                                    <h5>回款比率</h5>
                                    <p id="returnProportion"></p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div role="tabpanel" class="tab-pane" id="callAnalysis">呼叫分析</div>
                <div role="tabpanel" class="tab-pane" id="followAnalysis">跟进分析</div>
                <div role="tabpanel" class="tab-pane" id="taskProgress">任务进度</div>
            </div>
        </div>
    </div>
</div>

<!--<div class="container-fluid customer-page">
    <div class="card m-b-0">
        <div class="card-header">
            <h1>个人业绩报表11</h1>
        </div>
        <div class="card-body">
            <div class="swiper-container">
                <div class="swiper-wrapper"></div>
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>
            <div class="well card-well">
                <ul class="nav nav-tabs tabs-lg" role="tablist">
                    <li class="active"><a href="#call" aria-controls="call" role="tab" data-toggle="tab">呼叫中心</a></li>
                    <li ><a href="#business" aria-controls="business" role="tab" data-toggle="tab">商机</a></li>
                    <li><a href="#performance" aria-controls="performance" role="tab" data-toggle="tab">订单业绩</a></li>
                </ul>
                <div class="tab-content">
                    <div role="tabpanel" class="tab-pane pane-call active" id="call">
                        <div class="row filter-bar">
                            <div class="col-xs-12">
                                <div class="time-search pull-left">
                                    <input type="hidden" id="callCenterDataType" name="callCenterDataType" value="all"/>
                                    <div class="callCenterAll  active-second" onclick="callCenterSelTime('all')">全年</div>
                                    <div class="callCenterTopMonth" onclick="callCenterSelTime('topMonth')">上月</div>
                                    <div class="callCenterMonth" onclick="callCenterSelTime('month')">本月</div>
                                    <div class="callCenterWeek" onclick="callCenterSelTime('week')">本周</div>
                                </div>
                            </div>
                        </div>
                        <div class="well info-well">
                            <div class="row">
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #6699ff;"></i>总通话时长(秒)</span><p id="totalCalls"></p></div>
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #52cca3;"></i>电话个数</span><p id="callPhoneNumber"></p></div>
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #9580ff;"></i>有效电话数</span><p id="validPhoneNumber"></p></div>
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #c8b8ff;"></i>被恶意回复数</span><p id="maliciousNumber"></p></div>
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #fe8edb;"></i>优秀通话数</span><p id="excellentNumber"></p></div>
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #83d8ff;"></i>提炼话术</span><p id="refiningWords"></p></div>
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #ff6666;"></i>通话警告数</span><p id="callWarning"></p></div>
                                <div class="col-xs-3"><span><i class="mdi mdi-checkbox-blank-circle" style="color: #ffe066;"></i>投诉率</span><p id="complaint"></p></div>
                                <div class="col-xs-12"><div class="line"></div></div>
                                <div class="col-xs-4">
                                    <span>电话任务/完成率</span>
                                    <p><span id="callAndComplete"></span>分 / <span id="phoneCompleteRate"></span>%</p>
                                    <div class="progress">
                                        <div class="progress-bar progress-bar-info progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
                                            <span class="sr-only"></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xs-4">
                                    <span>联系人/完成率</span>
                                    <p><span id="contactAndCompletion"></span>分 / <span id="contactCompleteRate"></span>%</p>
                                    <div class="progress">
                                        <div class="progress-bar progress-bar-success progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
                                            <span class="sr-only"></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-xs-4">
                                    <span>业务金额任务/完成额度</span>
                                    <p><span id="businessAmount"></span>万 / ￥<span id="resultAmountTaskRate"></span></p>
                                    <div class="progress">
                                        <div class="progress-bar progress-bar-purple progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
                                            <span class="sr-only"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-12">
                                <div class="time-search pull-left">
                                    <input type="hidden" id="callChartsDataType" name="callChartsDataType" value="all"/>
                                    <div class="callChartsAll  active-second" onclick="callChartsSelTime('all')">全年</div>
                                    <div class="callChartsTopMonth" onclick="callChartsSelTime('topMonth')">上月</div>
                                    <div class="callChartsMonth" onclick="callChartsSelTime('month')">本月</div>
                                    <div class="callChartsWeek" onclick="callChartsSelTime('week')">本周</div>
                                </div>
                            </div>
                            <div class="col-xs-12">
                                <div id="callCharts"></div>
                            </div>
                        </div>
                        <div class="row filter-bar">
                            <div class="col-xs-12">
                                <div class="time-search pull-left">
                                    <input type="hidden" id="callTableDataType" name="callTableDataType" value="all"/>
                                    <div class="callTableAll  active-second" onclick="callTableSelTime('all')">全年</div>
                                    <div class="callTableTopMonth" onclick="callTableSelTime('topMonth')">上月</div>
                                    <div class="callTableMonth" onclick="callTableSelTime('month')">本月</div>
                                    <div class="callTableWeek" onclick="callTableSelTime('week')">本周</div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-12">
                                <table id="callTable" style="width: 100%;height: 150px"></table>
                            </div>
                        </div>
                    </div>
                    <div role="tabpanel" class="tab-pane" id="business">
                        <div class="row filter-bar">
                            <div class="col-xs-6">
                                <div class="select-switch pull-left dateType">
                                    &lt;!&ndash;                                    <span id="bs" class="hidden" th:text="${bs}"></span>&ndash;&gt;
                                    <label><input type="radio" name="dateType" value="" onclick="selectTime('all')" checked><span>全部</span></label>
                                    <label><input type="radio" name="dateType" value="thisLastMonth" onclick="selectTime('thisLastMonth')"><span>上月</span></label>
                                    <label><input type="radio" name="dateType" value="thisMonth" onclick="selectTime('thisMonth')"><span>本月</span></label>
                                    <label><input type="radio" name="dateType" value="thisQuarter" onclick="selectTime('thisQuarter')"><span>本季度</span></label>
                                    <label><input type="radio" name="dateType" value="thisYear" onclick="selectTime('thisYear')"><span>本年</span></label>
                                </div>
                            </div>
                            <div class="col-xs-6">
                                <div class="form-content input-group pull-right" style="width: 320px;">
                                    <input type="text"   class="form-control create-time date-input" id="startTime"
                                           placeholder="请输入起始时间" autocomplete="off">
                                    <span class="input-group-addon">至</span>
                                    <input type="text"   class="form-control create-time date-input" id="endTime"
                                           placeholder="请输入截止时间" autocomplete="off">
                                </div>
                                <div class="form-content" id="companySelect" style="display: none;">
                                    <select class="form-control pull-right" style="width: 150px;" id="companyId" type="text" title="请选择" data-live-search="true">
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-12">
                                <div style="width: 100%; height: 500px;" id="businessLine"></div>
                            </div>
                        </div>
                        <div class="row" style="display: none;">
                            <div class="col-xs-12">
                                <div class="time-search select-switch opportunityStatus" >
                                    <label><input type="radio" name="opportunityStatus" value="1" onclick="opportunityStatus('1')" checked><span>初步洽谈</span></label>
                                    <label><input type="radio" name="opportunityStatus" value="2" onclick="opportunityStatus('2')"><span>需求确定</span></label>
                                    <label><input type="radio" name="opportunityStatus" value="3" onclick="opportunityStatus('3')"><span>方案报价</span></label>
                                    <label><input type="radio" name="opportunityStatus" value="4" onclick="opportunityStatus('4')"><span>谈判</span></label>
                                    <label><input type="radio" name="opportunityStatus" value="5" onclick="opportunityStatus('5')"><span>洽谈合同</span></label>
                                    <label><input type="radio" name="opportunityStatus" value="6" onclick="opportunityStatus('6')"><span>赢单</span></label>
                                    <label><input type="radio" name="opportunityStatus" value="7" onclick="opportunityStatus('7')"><span>输单</span></label>
                                </div>
                            </div>
                            <div class="col-xs-9">
                                <div style="width: 80%;height: 500px;" id="businessPie"></div>
                            </div>
                            <div class="col-xs-3">
                                <ul class="client" id="businessTable" style="height: 500px;"></ul>
                            </div>
                        </div>
                    </div>
                    <div role="tabpanel" class="tab-pane trends" id="performance">
                        <div class="row filter-bar">
                            <div class="col-xs-12">
                                <div class="timeList pull-left">
                                    <div class="time-search">
                                        <input type="hidden" id="performanceChartsDataType" name="performanceChartsDataType" value="all"/>
                                        <div class="performanceChartsTopYear  active-second" onclick="performanceChartsSelTime('topYear')">上一年</div>
                                        <div class="performanceChartsYear" onclick="performanceChartsSelTime('year')">本年</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-8">
                                <div id="performanceChart" style="width: 100%;height: 350px;"></div>
                            </div>
                            <div class="col-xs-4">
                                <div class="month-ranking">
                                    <div class="box">
                                        <div id="pankNumber"></div>
                                        <h6>本月业绩排名<span></span></h6>
                                    </div>
                                    <div id="performancePie" style="width: 100%; height: 230px;"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row filter-bar">
                            <div class="col-xs-12">
                                <div class="timeList pull-left">
                                    <div class="time-search">
                                        <input type="hidden" id="performanceDataType" name="performanceDataType" value="all"/>
                                        <div class="performanceAll  active-second" onclick="performanceSelTime('all')">全部</div>
                                        <div class="performanceTopMonth" onclick="performanceSelTime('topMonth')">上月</div>
                                        <div class="performanceMonth" onclick="performanceSelTime('month')">本月</div>
                                        <div class="performanceWeek" onclick="performanceSelTime('week')">本周</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-8">
                                <table id="performanceTable" style="width: 100%;height: 200px;"></table>
                            </div>
                            <div class="col-xs-4">
                                <div class="performanceMess">
                                    <div class="list">
                                        <h6>合同作废率</h6>
                                        <div><span id="contractVoid"></span><span id="contractVoidValue">较高</span></div>
                                    </div>
                                    <div class="list">
                                        <h6>合同退款率</h6>
                                        <div><span id="contractRefund"></span><span id="contractRefundValue">高危</span></div>
                                    </div>
                                    <div class="list">
                                        <h6>发票冲红率</h6>
                                        <div><span id="invoiceFlushing"></span><span id="invoiceFlushingValue">高危</span></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>-->



</body>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/perfect-scrollbar.min.js"></script>
<!--标签插件-->
<script src="/js/jquery-tags-input/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="/js/main.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" src="/js/popper.min.js"></script>
<script type="text/javascript" src="/js/jquery.cookie.min.js"></script>
<!--时间选择插件-->
<script src="/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="/js/jquery-confirm/jquery-confirm.min.js"></script>
<script src="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>
<!--日期选择插件-->
<script src="/js/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
<script src="/js/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>
<script type="text/javascript" src="/js/crm/common/dataRangePicker.min.js"></script>
<!-- 多选框下拉 -->
<script type="text/javascript" src="/js/bootstrap-select.js"></script>
<script type="text/javascript" src="/js/bootstrap.lyear.dropdowntree.min.js"></script>
<!--table固定列-->
<script type="text/javascript" src="/js/bootstrap-table/extensions/fixed-columns/bootstrap-table-fixed-columns.js"></script>
<!-- 图表 -->
<script type="text/javascript" src="/js/echarts.min.js"></script>
<script type="text/javascript" src="/js/crm/common/common.js"></script>
<script type="text/javascript" src="/js/swiper/swiper.min.js"></script>
<!--<script src="/js/crm/opportunityManager/opportunityAnalysisForm.js"></script>-->
<script src="/js/crm/personalresults/personalResultsReports.js"></script>
</html>